{% extends 'base_dashboard.html' %}
{% load site_tags %}

{% block title %}Accounts Dashboard — {{ site_settings.institute_name }}{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-start mb-4 flex-wrap gap-2">
  <div>
    <h4 class="fw-bold mb-1">Accounts Dashboard</h4>
    <p class="text-muted small mb-0">Review course and certification payments. Teachers cannot see fees or earnings.</p>
  </div>
  <div class="d-flex gap-2">
    <a href="{% url 'enrollments:enrollment_review' %}?status=pending" class="btn btn-primary btn-sm">
      <i class="bi bi-clipboard-check me-1"></i>Course Admissions
    </a>
    <a href="{% url 'certifications:admin_applications' %}?needs_review=1" class="btn btn-outline-primary btn-sm">
      <i class="bi bi-award me-1"></i>Cert Payments
    </a>
  </div>
</div>

<div class="row g-3 mb-4">
  <div class="col-6 col-md-3">
    <div class="card border-0 shadow-sm rounded-4 p-3">
      <div class="fw-bold fs-3 text-warning">{{ pending_enrollments }}</div>
      <div class="text-muted small">Pending course payments</div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card border-0 shadow-sm rounded-4 p-3">
      <div class="fw-bold fs-3 text-warning">{{ pending_cert_payments }}</div>
      <div class="text-muted small">Pending cert payments</div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card border-0 shadow-sm rounded-4 p-3">
      <div class="fw-bold fs-3 text-success">{{ approved_enrollments }}</div>
      <div class="text-muted small">Approved enrollments</div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card border-0 shadow-sm rounded-4 p-3">
      <div class="fw-bold fs-3 text-primary">{{ certified_count }}</div>
      <div class="text-muted small">Issued certificates</div>
    </div>
  </div>
</div>

<div class="row g-4">
  <div class="col-lg-6">
    <div class="card border-0 shadow-sm rounded-4 h-100">
      <div class="card-body p-4">
        <div class="d-flex justify-content-between align-items-center mb-3">
          <h6 class="fw-bold mb-0">Pending course admissions</h6>
          <a href="{% url 'enrollments:enrollment_review' %}?status=pending" class="small">View all</a>
        </div>
        {% for e in recent_pending %}
          <div class="d-flex justify-content-between align-items-center py-2 border-bottom">
            <div>
              <div class="fw-semibold small">{{ e.student.get_display_name }}</div>
              <div class="text-muted" style="font-size:.75rem;">{{ e.course.title }} · {% format_price e.course.price %}</div>
            </div>
            <a href="{% url 'enrollments:enrollment_detail' e.pk %}" class="btn btn-sm btn-outline-primary">Review</a>
          </div>
        {% empty %}
          <p class="text-muted small mb-0">No pending course payments.</p>
        {% endfor %}
      </div>
    </div>
  </div>
  <div class="col-lg-6">
    <div class="card border-0 shadow-sm rounded-4 h-100">
      <div class="card-body p-4">
        <div class="d-flex justify-content-between align-items-center mb-3">
          <h6 class="fw-bold mb-0">Pending certification fees</h6>
          <a href="{% url 'certifications:admin_applications' %}?needs_review=1" class="small">View all</a>
        </div>
        {% for a in recent_cert_pending %}
          <div class="d-flex justify-content-between align-items-center py-2 border-bottom">
            <div>
              <div class="fw-semibold small">{{ a.candidate.get_display_name }}</div>
              <div class="text-muted" style="font-size:.75rem;">{{ a.program.title }} · {% format_price a.current_fee_due %}</div>
            </div>
            <a href="{% url 'certifications:admin_application_detail' a.pk %}" class="btn btn-sm btn-outline-primary">Review</a>
          </div>
        {% empty %}
          <p class="text-muted small mb-0">No certification payments awaiting review.</p>
        {% endfor %}
      </div>
    </div>
  </div>
</div>
{% endblock %}